import Base from "../Base.js";
import adminsApi from "../../api/admins.js";

export default class extends Base {
    constructor(props) {
        super(props);
    }
    handle() {
        layui.table.on('tool(seatsList)', async (obj) => {
            //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            // var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            // var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）
            const _id = obj.data._id;
            if (layEvent == "updateSeat") {
                location.hash = `#/info/updateSeat/${obj.data.theaterId._id}`;
            }
        })
    }
    render() {
        this.el.html(`
        <table id="seatsList" lay-filter="seatsList"></table>
            <script type="text/html" id="barDemo">
                <a class="layui-btn layui-btn-xs" lay-event="updateSeat">座位管理</a>
            </script>
        `);
        this.reRender();
    }
    reRender() {
        layui.table.render({
            elem: '#seatsList'
            , method: "get"
            , url: '/api/seats' //数据接口
            , headers: { Authorization: `Bearer ${adminsApi.getToken()}` }
            , page: true //开启分页
            , limits: [5, 10, 15, 20]
            , cols: [[ //表头
                { field: '_id', title: 'ID', sort: true, fixed: 'left' }
                , { field: 'theaterId', title: '放映厅', templet: '<div>{{d.theaterId.name}}</div>' }
                , { field: 'row', title: '行号', sort: true }
                , { field: 'col', title: '列号', sort: true }
                , { fixed: 'right', align: 'center', toolbar: '#barDemo' }
            ]],
        });
    }
}